<template>
  <div>
    <el-card>
      <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
        <el-tab-pane label="星期一" name="first">
          <el-table :data="tableData" border style="width: 100%">
            <el-table-column prop="classtimes" align="center" >
            </el-table-column>
            <el-table-column prop="name" align="center" label="一班">

            </el-table-column>
            <el-table-column prop="address" align="center" label="二班">
            </el-table-column>
            <el-table-column prop="address" align="center" label="三班">
            </el-table-column>
            <el-table-column prop="address" align="center" label="四班">
            </el-table-column>
            <el-table-column prop="address" align="center" label="五班">
            </el-table-column>
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="星期二" name="second">
          <el-table :data="tableData" border style="width: 100%">
            <el-table-column prop="classtimes" align="center">
            </el-table-column>
            <el-table-column prop="name" align="center" label="一班">
            </el-table-column>
            <el-table-column prop="address" align="center" label="二班">
            </el-table-column>
            <el-table-column prop="address" align="center" label="三班">
            </el-table-column>
            <el-table-column prop="address" align="center" label="四班">
            </el-table-column>
            <el-table-column prop="address" align="center" label="五班">
            </el-table-column>
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="星期三" name="third">
          <el-table :data="tableData" border style="width: 100%">
            <el-table-column prop="classtimes" align="center" >
            </el-table-column>
            <el-table-column prop="name" align="center" label="一班">
            </el-table-column>
            <el-table-column prop="address" align="center" label="二班">
            </el-table-column>
            <el-table-column prop="address" align="center" label="三班">
            </el-table-column>
            <el-table-column prop="address" align="center" label="四班">
            </el-table-column>
            <el-table-column prop="address" align="center" label="五班">
            </el-table-column>
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="星期四" name="fourth">
          <el-table :data="tableData" border style="width: 100%">
            <el-table-column prop="classtimes" align="center">
            </el-table-column>
            <el-table-column prop="name" align="center" label="一班">
            </el-table-column>
            <el-table-column prop="address" align="center" label="二班">
            </el-table-column>
            <el-table-column prop="address" align="center" label="三班">
            </el-table-column>
            <el-table-column prop="address" align="center" label="四班">
            </el-table-column>
            <el-table-column prop="address" align="center" label="五班">
            </el-table-column>
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="星期五" name="friday">
          <el-table :data="tableData" border style="width: 100%">
            <el-table-column prop="classtimes" align="center">
              <el-button></el-button>
            </el-table-column>
            <el-table-column prop="classinput" align="center" label="一班">
            </el-table-column>
            <el-table-column prop="address" align="center" label="二班">
            </el-table-column>
            <el-table-column prop="address" align="center" label="三班">
            </el-table-column>
            <el-table-column prop="address" align="center" label="四班">
            </el-table-column>
            <el-table-column prop="address" align="center" label="五班">
            </el-table-column>
          </el-table>
        </el-tab-pane>
      </el-tabs>
    </el-card>
  </div>
</template>
<script>
export default{
  data(){
    return{
      activeName: 'first',
      tableData:[
        {
          classtimes:'1',
          classinput:`<el-input></el-input>`
        },
        {
          classtimes:'2'
        },
        {
          classtimes:'3'
        },
        {
          classtimes:'4'
        },
        {
          classtimes:'5'
        },
        {
          classtimes:'6'
        },
        {
          classtimes:'7'
        },
        {
          classtimes:'8'
        },
      ],
    }
  },
  methods: {
      handleClick(tab, event) {
        console.log(tab, event);
      }
    }
}

</script>